import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:kkhousekeep/page/me/edit_nickname_controller.dart';
import 'package:kkhousekeep/widget/custom_app_bar.dart';

import '../../widget/custom_button.dart';

class EditNickname extends StatelessWidget {
  const EditNickname({super.key});

  @override
  Widget build(BuildContext context) {
    return GetBuilder<EditNicknameController>(
        init: EditNicknameController(),
        builder: (controller) => Scaffold(
            appBar: CustomAppBar("修改昵称"),
            body: Container(
              padding: EdgeInsets.only(top: 32.h, bottom: 60.h),
              color: const Color(0xFFf4f5f6),
              child: SafeArea(
                left: false,
                right: false,
                child: Column(
                  children: [
                    _buildSectionList(controller),
                    const Spacer(),
                    _buildSaveButton(controller)
                  ],
                ),
              ),
            )));
  }

  Widget _buildSectionList(EditNicknameController controller) {
    return Container(
      color: Colors.white,
      height: 96.h,
      padding: EdgeInsets.only(left: 32.w, right: 32.w),
      child: Obx(
        () => Row(
          children: [
            Text(
              "昵称",
              style: TextStyle(
                fontSize: 32.sp,
                color: const Color(0xFF333333),
              ),
            ),
            SizedBox(
              width: 32.w,
            ),
            Expanded(
                child: TextField(
              controller: controller.nicknameTextEditingController,
              style: const TextStyle(
                color: Color(0xFF999999),
              ),
              decoration: const InputDecoration(
                border: InputBorder.none,
                hintText: "请输入昵称",
                hintStyle: TextStyle(
                  color: Color(0xFF999999),
                ),
              ),
            )),
            SizedBox(
              width: 32.w,
            ),
            Text(
              "${controller.username.value.length}/15",
              style: TextStyle(
                fontSize: 32.sp,
                color: const Color(0xFF999999),
              ),
            )
          ],
        ),
      ),
    );
  }

  Widget _buildSaveButton(EditNicknameController controller) {
    return CustomButton(
      isAsh: false,
      width: 420.w,
      height: 90.h,
      text: "保存",
      onPressed: () {},
    );
  }
}
